<template>
  <div>
    <BasicTable @register="registerTable">
      <template #bodyCell="{ column, record }">
        <template v-if="column.key == 'info'">
          <span class="hover:underline text-primary" @click="handleQuestionInfo(record)">查看</span>
        </template>

        <template v-if="column.key === 'action'">
          <TableAction :actions="createActions(record)" />
        </template>
      </template>
    </BasicTable>

    <ChooseQuestion @register="registerModal" @ok="handleConfirmQuestion" />
    <RecommendResult @register="registerRecommendModal" />
  </div>
</template>
<script lang="tsx" setup>
  import { BasicTable, useTable, TableAction, ActionItem } from '@/components/Table';
  import { getBasicColumns, getBasicData, getFormConfig } from './tableData';
  import { useGo } from '@/hooks/web/usePage';
  import { useModal } from '@/components/Modal';
  import ChooseQuestion from './components/choose-question.vue';
  import RecommendResult from './components/recommend-result.vue';

  const go = useGo();

  function createActions(record: any): ActionItem[] {
    return [
      {
        label: '生成最新分析',
        // onClick: handleEdit.bind(null, record),
      },
    ];
  }

  const [registerModal, { openModal }] = useModal();

  const [registerRecommendModal, { openModal: openRecommendModal }] = useModal();

  function handleQuestionInfo(record: any) {
    // go({
    //   name: 'UserInfo',
    //   query: {
    //     id: record.id,
    //   },
    // });

    openModal(true, {
      id: record.id,
    });
  }

  const handleConfirmQuestion = (id) => {
    openRecommendModal(true, {
      id,
    });
  };

  const [registerTable] = useTable({
    columns: getBasicColumns(),
    useSearchForm: true,
    formConfig: getFormConfig(),
    showTableSetting: false,
    showIndexColumn: false,
    rowKey: 'id',
    striped: false,
    dataSource: getBasicData(),
    actionColumn: {
      title: '操作',
      dataIndex: 'action',
    },
  });
</script>
